<template>
	<view class="page_content">
		<!-- <view class="text_32 mb_16">Real-Infintity || 恒纪元实验室</view>
		<veiw class="flex_between mt_24">
		</veiw> -->
		<u-list @scrolltolower="scrolltolower" v-if="indexList.length > 0">
			<veiw class="flex_start_wrap">
				<view style="width: 49%;" v-for="(item, index) in indexList" class="mt_24" :key="index"
					@click="handleDetail(item)">
					<u-image :src="item.src" width="100%" height="100" radius="12" mode="aspectFill"></u-image>
					<view class="content_border">
					<view class="flex_between mt_16" @click.stop="handleModel(item)">
						<view>{{ item.modelName }}</view>
						<view v-if="type == 1" class="flex_center_end" :style="{color:statusList[item.status].color}">
							{{statusList[item.status].name}}
						</view>
						<view v-if="type == 2" class="flex_center_end"><u-icon name="eye"></u-icon> {{item.viewNum}}</view>
					</view>
					<!-- <view v-if="type == 1" style="padding-top: 16rpx;font-size: 24rpx;height: 50rpx;">
						<span v-if="item.status == 2">模型构建剩余时间: {{formatTime(item.remainCompleteTime)}}</span>
					</view> -->
					</view>
				</view>
			</veiw>
		</u-list>
		<u-empty mode="data" marginTop="160" v-else></u-empty>
		<u-divider v-if="indexList.length > 0" :text="loadingText"></u-divider>
	</view>
</template>

<script>
import {
	modelList,
	selectFavoriteModelList,
	startTask
} from '@/api/common.js'
import config from '@/config.js'
export default {
	data() {
		return {
			statusList:[{
				name:'未启动',
				color:'#5599FF'
			},{
				name:'排队中',
				color:'#5F9EA0'
			},{
				name:'模型构建中',
				color:'#B8860B '
			},{
				name:'构建成功',
				color:'#0000CD'
			},{
				name:'构建失败',
				color:'#A42D00 '
			}],
			pageParam: {
				displayType: 2,
				pageNum: 1,
				pageSize: 30
			},
			loadingText: '',
			total: 0,
			indexList: [],
			type: 0,
			times: null
		}
	},
	beforeDestroy() { 
	  clearInterval(this.times)
	},
	onLoad(options) {
		uni.$on('handleList',data => {
			this.refresh()
		})
		this.type = options.type
		uni.setNavigationBarTitle({
			title: options.type == 1 ? '我的3D资产' : '我的收藏'
		})
		this.times = setInterval(() => {
		 this.refresh()
		}, 1000 * 60)
		this.loadmore()
	},
	computed: {
		formatTime() {
		    return function(time) {
		       const hours = Math.floor(time / 3600); // 计算小时数
		       const minutes = Math.floor((time % 3600) / 60); // 计算分钟数
		       return hours + '小时' + minutes + '分钟';             
		    }
		},
	},
	onReachBottom() {
		if (this.indexList.length < this.total) {
			setTimeout(() => {
				this.pageParam.pageNum++
				this.loadmore()
			}, 1000)
		}
	},
	methods: {
		refresh() {
			this.pageParam = {
				displayType: 2,
				pageNum: 1,
				pageSize: 30
			}
			this.loadmore()
		},
		scrolltolower() {
			if (this.indexList.length < this.total) {
				setTimeout(() => {
					this.pageParam.pageNum++
					this.loadmore()
				}, 1000)
			}
		},
		loadmore() {
			if (this.type == 1) {
				modelList(this.pageParam).then(res => {
					this.handleData(res)
				})
			} else {
				selectFavoriteModelList(this.pageParam).then(res => {
					this.handleData(res)
				})
			}
		},
		handleData(res) {
			if (res.code == 200) {
				let rows = res.rows
				rows.forEach(item => {
					item.src = config.baseImg + item.logo
				})
				this.indexList = this.pageParam.pageNum == 1 ? rows : this.indexList.concat(rows)
				this.total = res.total
				if (this.indexList.length == this.total) {
					this.loadingText = '已加载完成'
				} else {
					this.loadingText = '加载中'
				}
			}
		},
		handleModel(item) {
			if(this.type == 1) {
				if(item.status != 0) {
					if(item.status == 2) {
						uni.navigateTo({
							url: '/pages/schedule?buildModelId=' + item.buildModelId
						});
					}
					return 
				}
				startTask({buildModelId:item.buildModelId}).then(res => {
					if(res.code == 200) {
						uni.showToast({
						title: '启动成功',
							icon: 'none'
						});
						this.refresh()
					}
				})
			}
		},
		handleDetail(item) {
			uni.navigateTo({
				url: '/pages/animation?data=' + JSON.stringify(item)
			});
		}
	}
}
</script>
<style scoped>
.page_content {
	padding-top: 0;
}
.mt_24:nth-child(2n-1) {
	margin-right: 2%;
}
</style>